import { nextTick, onMounted, onActivated, onUnmounted, onDeactivated } from 'vue'

export function onMountedOrActivated(hook: Fn) {
  let mounted: boolean

  onMounted(() => {
    hook()
    nextTick(() => {
      mounted = true
    })
  })

  onActivated(() => {
    if (mounted) {
      hook()
    }
  })
}

export function onUnMountedOrDeactivated(hook: Fn) {
  let active = true

  onActivated(() => {
    active = true
  })

  onUnmounted(() => {
    if (active) {
      hook()
    }
  })

  onDeactivated(() => {
    active = false
    hook()
  })
}
